<template>
	<view class="">
		<!-- 	<view class="my-header">
			<view class="status_bar" :style="'height:'+height+'px;'"></view>
			<view class="flex size-36 white plr-36 ptb-20">
				<view class="" style="width: 40rpx;" @click="back">
					<u-icon name="arrow-left" size="40"></u-icon>
				</view>
				<view class="">
					个人中心
				</view>
				<view class="" style="width: 40rpx;"></view>
			</view>
		</view> -->
		<view class="my-card">
			<view class="img-pic text-center">
				<image src="../../static/siji.png" mode=""></image>
				<view class="text-center ml-20" style="margin-top: -130rpx;">
					{{!token?'':userInfo.nickname?userInfo.nickname:userInfo.wx_name}}
				</view>
				<view class="rz-bg" @click="goIDcard() ">
					<text v-if="this.userInfo.real_verified == 0" class="text1 pb-5">未认证</text>
					<text v-else-if="this.userInfo.real_verified==2" class="text2 pb-5">审核中</text>
					<text v-else class="text3 pb-5">已认证</text>
				</view>
			</view>
			<!-- 旧订单 -->
			<!-- 	<view class="flex1 mt-20">
				<view class="text-center" style="width: 33.333%;" v-if="hasDJ">
					<navigator hover-class="none" url="/pages/my/order/dj-order">
						<view class="img-nav">
							<image src="../../static/my-daijia.png" mode=""></image>
						</view>
						<view class="size-26">
							代驾单
						</view>
					</navigator>
				</view>
				<view class="text-center" style="width: 33.333%;" v-if="hasSF">
					<navigator hover-class="none" url="/pages/shunfeng/order-list">
						<view class="img-nav">
							<image src="../../static/my-sf.png" mode=""></image>
						</view>
						<view class="size-26">
							顺风单
						</view>
					</navigator>
				</view>
				<view class="text-center" style="width: 33.333%;" v-if="hasHY">
					<navigator hover-class="none" url="/pages/huoyun/order">
						<view class="img-nav">
							<image src="../../static/my-hy.png" mode=""></image>
						</view>
						<view class="size-26">
							货运单
						</view>
					</navigator>
				</view>
			</view> -->
		</view>
		<!-- <view class="mt-80">
			<u-cell-item title="安全中心" @click="goSecurity">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my-security.png" mode=""></image>
				</view>
			</u-cell-item>
		</view> -->
		<view class="mlr-40" style="margin-top: 150rpx;">
			<u-cell-item title="历史订单" @click="goOrder">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my/my-order.png" mode=""></image>
				</view>
			</u-cell-item>
			<!-- 	<u-cell-item title="实名认证" @click="goIDcard">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my-IDcard.png" mode=""></image>
				</view>
			</u-cell-item> -->
			<!-- <u-cell-item title="优惠券" @click="goCoupon">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my-coupon.png" mode=""></image>
				</view>
			</u-cell-item> -->
			<u-cell-item title="我的车辆" @click="goCar">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my/my-car.png" mode=""></image>
				</view>
			</u-cell-item>
			<u-cell-item title="联系客服" @click="call">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my/my-customer.png" mode=""></image>
				</view>
			</u-cell-item>
			<!-- <u-cell-item title="投诉进度" @click="goPro">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my-complaints.png" mode=""></image>
				</view>
			</u-cell-item> -->
			<u-cell-item title="设置" @click="goSet">
				<view slot="icon" class="img-icon mr-20">
					<image src="../../static/my/my-set.png" mode=""></image>
				</view>
			</u-cell-item>
		</view>
		<view class="" style="position: absolute;  bottom: 300rpx; ">
			<view class="pd-36 mt-30">
				<u-button type="primary" @click="exit">退出登录</u-button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				fee: '', //平台服务费
				income: '', //累计收入
				money: '', //可提现金额
				today_money: '', //今日收入
				IDcard: '未认证',
				Driver: '未认证',
				Owner: '',
				show: false, //支付
				show1: true,
			}
		},
		computed: {
			...mapState(['userInfo', 'token', 'height', 'tabList']),
			hasSF() {
				let a = false
				this.tabList.forEach(item => {
					if (item.id == 1) a = true
				})
				return a
			},
			hasDJ() {
				let a = false
				this.tabList.forEach(item => {
					if (item.id == 0) a = true
				})
				return a
			},
			hasHY() {
				let a = false
				this.tabList.forEach(item => {
					if (item.id == 2) a = true
				})
				return a
			},
		},
		onShow() {

		},
		methods: {
			exit() {
				this.$store.commit('exitLogin')
				uni.redirectTo({
					url: '/pages/welcome/welcome'
				})
				setTimeout(() => {
					uni.showToast({
						title: '退出成功'
					})
				}, 100)
			},
			back() {
				uni.navigateBack({

				})
			},
			//我的车辆
			goCar() {
				uni.navigateTo({
					url: '/pages/my/Car'
				})
			},
			//历史订单
			goOrder() {
				uni.navigateTo({
					url: '/pages/my/order/order'
				})
			},
			//安全中心
			goSecurity() {
				uni.navigateTo({
					url: '/pages/home/security'
				})
			},
			//实名认证
			goIDcard() {
				if (this.userInfo.real_verified == 0 || this.userInfo.real_verified == -1) {
					uni.navigateTo({
						url: '/pages/my/IDcard'
					})
				} else if (this.userInfo.real_verified == 2) {
					uni.showToast({
						title: '审核中，请耐心等待..',
						icon: 'none'
					})
				} else {
					uni.navigateTo({
						url: '/pages/my/IDcard-success'
					})
				}
			},
			//优惠券
			goCoupon() {
				uni.navigateTo({
					url: '/pages/my/coupon/index'
				})
			},
			//投诉进度
			goPro() {
				uni.navigateTo({
					url: '/pages/my/complaints/progress'
				})
			},
			//联系客服
			call() {
				this.$http('/addons/ddrive/user/consumer_hotline', {}, "POST").then(data => {
					uni.makePhoneCall({
						phoneNumber: data.tel //仅为示例
					});
				})
			},
			//设置
			goSet() {
				uni.navigateTo({
					url: '/pages/my/set/index'
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.u-btn {
		width: 400rpx !important;
		border-radius: 50rpx !important;
		background: linear-gradient(to right, #3CBCA3, #3CBCA3) !important;
	}

	.my-header {
		height: 218rpx;
		background: url(../../static/my-bg.png) no-repeat;
		background-size: 100% 100%;
	}

	.my-card {
		// height: 320rpx;
		// margin-top: -85rpx;
		// background: linear-gradient(#43D0C3, #E2FAF5, #F7FFFD);
		// box-shadow: 4px 4px 12px 0px rgba(124, 122, 122, 0.35);

		.img-pic {
			image {
				width: 160rpx;
				height: 160rpx;
				margin-top: 100rpx;
				margin-right: 360rpx;
			}
		}

		.rz-bg {
			margin-top: 20rpx;
			margin-left: 240rpx;
			width: 180rpx;
			height: 55rpx;
		}

		.text1 {
			display: flex;
			justify-content: center;
			align-items: center;
			color: #FC9153;
			border: 2rpx solid #FC9153;
			border-radius: 50rpx;
		}

		.text2 {
			display: flex;
			justify-content: center;
			align-items: center;
			color: #0055ffa3;
			border: 2rpx solid #0055ffa3;
			border-radius: 50rpx;
		}

		.text3 {
			display: flex;
			justify-content: center;
			align-items: center;
			color: #3CBCA3;
			border: 2rpx solid #3CBCA3;
			border-radius: 50rpx;
		}

		.img-nav {
			image {
				width: 90rpx;
				height: 90rpx;
			}
		}
	}

	.img-icon {
		height: 46rpx;

		image {
			width: 46rpx;
			height: 46rpx;
		}
	}
</style>
